<template>
  <div class="war">
    <div class="area-center">
      <!-- 各省商会头部 -->
      <Head title="各省商会"></Head>
      <div class="bottom">
        <div class="title_word m-t-10">请选择</div>
        <div class="center m-t-0">
          <div class="shenghui title-center">
            <div class="text_top m-t" @click="provincialsub(citysub, id)">
              <div class="icon">
                <img src="../../../assets/black_star.png" alt="" />
              </div>
              <div class="text">
                {{ LocationPCity }}
              </div>
            </div>
            <div
              class="text_top m-t"
              v-for="(item, index) in title"
              :key="index"
              @click="provincial(item.text)"
            >
              <div class="icon">
                <img src="../../../assets/black_star.png" alt="" />
              </div>
              <div class="text">
                {{ item.text }}
              </div>
            </div>
            <div
              class="text_top m-t"
              v-for="(item, index) in list"
              :key="'text_top' + index"
              @click="national(item)"
            >
              <div class="icon">
                <img src="../../../assets/black_star.png" alt="" />
              </div>
              <div class="text">
                {{ item.chambertypeName }}
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
  
  <script>
import { Notice } from "@/api/index";
import { selectCofcChamberType } from "@/api/chambe";
import Head from "@/components/public/HeadPage.vue";
export default {
  data() {
    return {
      title: [{ text: "全国各省" }, { text: "海外" }],
      list: "",
      address: [],
      id: "",
      LocationPCity: sessionStorage.getItem("province"),
      citysub: sessionStorage.getItem("provincesub"),
    };
  },
  components: {
    Head,
  },
  //各省会发送请求的
  created() {
    Notice().then((res) => {
      this.address = res.data;
      for (let i = 0; i < res.data.length; i++) {
        if (res.data[i].provincial == this.citysub) {
          this.id = res.data[i].pid;
        }
      }
    }),
      selectCofcChamberType("all").then((res) => {
        if (res.data.code == 200) {
          this.list = res.data.data;
        }
      });
  },
  methods: {
    // provincial(item) {
    // 	this.$router.push({ path: "/chambertwo/chamberfour",
    // 	 query: { id: item.pid, name: item.provincial }
    // 	})
    // 	this.$store.commit("NUM_LIST_PROVINCE", { inputval: item.provincial })
    // },

    //定位省份跳转
    provincialsub(item, id) {
      this.$router.push({
        path: "/chambertwo/chamberfour",
        query: { item, id },
      });
    },
    //其他省份跳转
    provincial(city) {
      if (city == "全国各省") {
        this.$router.push({ path: "/chamberprovince", query: { city } });
      } else {
        this.$router.push({ path: "/chambersix", query: { city } });
      }
    },
    national(i) {
      this.$router.push({
        path: "/chambersix",
        query: {
          id: i.chambertypeId,
          city: i.chambertypeName,
        },
      });
    },
  },
};
</script>
  
  <style scoped>
.bo {
  width: 100%;
  min-height: 2.78rem;
}
/* 各省商会头部区域 */
.top {
  width: 100%;
  /* margin-top: .03rem; */
  display: flex;
  justify-content: center;
}
.top .center {
  width: 95%;
}
.wen {
  width: 100%;
  min-height: 0.5rem;
  line-height: 0.25rem;
  font-weight: 700;
}
.top h3 img {
  width: 0.24rem;
  margin-right: 0.05rem;
}
.m-t{
  margin: .01rem 0;
}
.bottom {
  width: 100%;
  min-height: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bottom .title_word {
  width: 93%;
}
.bottom .center {
  width: 98%;
  height: 100%;
}
/* 省会区域 */
.shenghui {
  display: flex;
  flex-wrap: wrap;
}

.text_top {
  width: 100%;
  display: flex;
}
.icon {
  margin-top: -0.02rem;
}
.icon img {
  height: 0.18rem;
  padding: .08rem 0 0 0.06rem;
}

.text_top .text {
  width: 90%;
  padding-left: 0.05rem;
}
</style>